import React from "react";
import { 
  Brain, Plus, Sparkles, Wand2, Table, BookOpen, 
  AlertTriangle, HelpCircle, MousePointer, Eye, Loader2
} from "lucide-react";
import { Button } from "@/components/ui/button";
import { Switch } from "@/components/ui/switch";
import { Label } from "@/components/ui/label";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";

const EditorToolbar = ({
  schemes,
  selectedSchemeId,
  setSelectedSchemeId,
  previewEnabled,
  setPreviewEnabled,
  isAiProcessing,
  isGeneratingTable,
  isGeneratingFromOutline,
  isCheckingVariables,
  isPreviewLoading,
  previewData,
  onAiGenerateTemplate,
  onAiContentFull,
  onAiContentSelected,
  onAiVariableReplace,
  onAiSelectedReplace,
  onAiTableGenerate,
  onToggleOutlineInput,
  onVariableCheck,
  onShowVariableGuide,
  onManualPreview,
  onOpenFullPreview,
}) => {
  return (
    <>
      {/* 预览数据源和开关 */}
      <div className="flex items-center justify-between flex-wrap gap-x-6 gap-y-2">
        <div className="flex items-center gap-2">
          <Label className="flex-shrink-0 font-semibold text-gray-700">预览数据源:</Label>
          <Select value={selectedSchemeId || ""} onValueChange={setSelectedSchemeId} disabled={!previewEnabled}>
            <SelectTrigger className="w-full sm:w-[280px] bg-white">
              <SelectValue placeholder="选择一个方案进行预览..." />
            </SelectTrigger>
            <SelectContent>
              {schemes.map((s) => (
                <SelectItem key={s.id} value={s.id}>{s.name}</SelectItem>
              ))}
            </SelectContent>
          </Select>
          {isPreviewLoading && <Loader2 className="w-4 h-4 animate-spin text-blue-500" />}
        </div>

        <div className="flex items-center gap-3">
          <div className="flex items-center gap-2">
            <Label className="flex-shrink-0 font-medium text-gray-700">预览功能:</Label>
            <Switch id="preview-toggle" checked={previewEnabled} onCheckedChange={setPreviewEnabled} />
            <Label
              htmlFor="preview-toggle"
              className={`text-sm cursor-pointer ${previewEnabled ? "text-green-600" : "text-gray-500"}`}
            >
              {previewEnabled ? "已开启" : "已关闭"}
            </Label>
          </div>
        </div>
      </div>

      {/* AI工具和操作按钮 */}
      <div className="flex items-center justify-between w-full gap-3 pt-3 border-t border-gray-200/50 flex-wrap">
        <div className="flex items-center gap-2 flex-wrap">
          <Label className="flex-shrink-0 font-medium text-gray-700">AI助手:</Label>
          {/* <Button
            variant="outline"
            size="sm"
            onClick={onAiContentFull}
            disabled={isAiProcessing}
            className="bg-gradient-to-r from-indigo-50 to-purple-50 border-indigo-200 text-indigo-700 hover:from-indigo-100 hover:to-purple-100"
          >
            {isAiProcessing ? <Loader2 className="w-4 h-4 mr-2 animate-spin" /> : <Brain className="w-4 h-4 mr-2" />}
            AI补充全文
          </Button> 
          <Button
            variant="outline"
            size="sm"
            onClick={onAiContentSelected}
            disabled={isAiProcessing}
            className="bg-gradient-to-r from-emerald-50 to-teal-50 border-emerald-200 text-emerald-700 hover:from-emerald-100 hover:to-teal-100"
          >
            {isAiProcessing ? <Loader2 className="w-4 h-4 mr-2 animate-spin" /> : <Plus className="w-4 h-4 mr-2" />}
            AI补充选中
          </Button>
          <Button
            variant="outline"
            size="sm"
            onClick={onAiVariableReplace}
            disabled={isAiProcessing}
            className="bg-gradient-to-r from-purple-50 to-blue-50 border-purple-200 text-purple-700 hover:from-purple-100 hover:to-blue-100"
          >
            {isAiProcessing ? <Loader2 className="w-4 h-4 mr-2 animate-spin" /> : <Sparkles className="w-4 h-4 mr-2" />}
            AI变量替换
          </Button>
          <Button
            variant="outline"
            size="sm"
            onClick={onAiSelectedReplace}
            disabled={isAiProcessing}
            className="bg-gradient-to-r from-green-50 to-emerald-50 border-green-200 text-green-700 hover:from-green-100 hover:to-emerald-100"
          >
            {isAiProcessing ? <Loader2 className="w-4 h-4 mr-2 animate-spin" /> : <Wand2 className="w-4 h-4 mr-2" />}
            AI选中替换
          </Button>
          <Button
            variant="outline"
            size="sm"
            onClick={onAiTableGenerate}
            disabled={isGeneratingTable || isAiProcessing}
            className="bg-gradient-to-r from-cyan-50 to-blue-50 border-cyan-200 text-cyan-700 hover:from-cyan-100 hover:to-blue-100"
          >
            {isGeneratingTable ? <Loader2 className="w-4 h-4 mr-2 animate-spin" /> : <Table className="w-4 h-4 mr-2" />}
            AI生成表格
          </Button>
          */}
          <Button
            variant="outline"
            size="sm"
            onClick={onToggleOutlineInput}
            disabled={isGeneratingFromOutline}
            className="bg-gradient-to-r from-rose-50 to-pink-50 border-rose-200 text-rose-700 hover:from-rose-100 hover:to-pink-100"
          >
            {isGeneratingFromOutline ? <Loader2 className="w-4 h-4 mr-2 animate-spin" /> : <BookOpen className="w-4 h-4 mr-2" />}
            根据目录生成
          </Button>
        </div>

        <div className="flex items-center gap-2">
          <Button
            variant="outline"
            size="sm"
            onClick={onVariableCheck}
            disabled={isCheckingVariables}
            className="bg-white border-purple-200 text-purple-700 hover:bg-purple-50"
          >
            {isCheckingVariables ? <Loader2 className="w-4 h-4 mr-2 animate-spin" /> : <AlertTriangle className="w-4 h-4 mr-2" />}
            变量检查
          </Button>
          <Button
            variant="outline"
            size="sm"
            onClick={onShowVariableGuide}
            className="bg-white border-blue-200 text-blue-700 hover:bg-blue-50"
          >
            <HelpCircle className="w-4 h-4 mr-2" />
            变量手册
          </Button>
          <Button
            variant="outline"
            size="sm"
            onClick={onManualPreview}
            disabled={!previewEnabled || !previewData || isPreviewLoading}
            className="bg-white border-blue-200 text-blue-700 hover:bg-blue-50"
          >
            <MousePointer className="w-4 h-4 mr-2" />
            预览选中
          </Button>
          <Button
            variant="outline"
            size="sm"
            onClick={onOpenFullPreview}
            className="bg-white border-green-200 text-green-700 hover:bg-green-50"
            disabled={!previewData || isPreviewLoading}
          >
            <Eye className="w-4 h-4 mr-2" />
            全文预览
          </Button>
        </div>
      </div>
    </>
  );
};

export default EditorToolbar;